<template>
	<view>
		<!-- 懒加载动画 -->
		<view class="loading-box">
			<u-loading :show="loadingone" color="#41ADBA" size="70"></u-loading>
		</view>
		<view class="pagebgf" v-show="!loadingone" :style="planArr.length <=0?'background:#f5f5f5':''">
			<navbar name="健康计划"></navbar>
			<block v-for="(item,idx) in planArr" :key="idx">
				<view class="planArrView">
					<view class="weui-flex">
						<view class="weui-flex__item">
							<view class="placeholder">
								{{item.taskName}}
							</view>
						</view>
						<view>
							<view class="placeholder">
								<view class="weui-flex">
									<view class="weui-flex__item">
										<view class="placeholder ranone">
										</view>
									</view>
									<view>
										<view class="placeholder rantwo">
										</view>
									</view>
									<view>
										<view class="placeholder rantwo">
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="weui-flex imgagecen" @tap="myPlay(item,idx,'play')">
					<view class="lazy-load">
						<u-lazy-load height="260" img-mode="aspectFill" :image="item.taskImage"></u-lazy-load>
					</view>
					<view class="txtRi">
						<view class="item-progress" :style="item.taskStatus=='0'?'background: #F56767;color:#fff':''">
							<view v-show="item.taskStatus==0">
								进行中
							</view>
							<view v-show="item.taskStatus==1">
								已完成
							</view>
							<!-- <view v-show="item.taskStatus==2">
								已废弃
							</view> -->
						</view>
						<view class="txtnum">
							{{item.taskPeriod}}
						</view>
						计划天数
					</view>
				</view>
			</block>
			<view class="no-plan" v-if="planArr.length <=0">
				<view class="plan-bgimage">
				</view>
				<text>
					还未参与计划
					科学指导，有效改善健康状态
				</text>
			</view>
			<view style="height: 300upx;">

			</view>
			<!-- v-if="planArr.length !=0"   @click="addShow = true"-->
			<button v-if="planArr.length ==0" type="default" class="BeganToPlan"
				@tap="navurl('/pages/subpackage/find/healthPlan/healthPlan')">参与健康计划</button>
		</view>
	</view>

</template>

<script>
	import uLoading from "@/uview-ui/components/u-loading/u-loading.vue"

import uLazyLoad from "@/uview-ui/components/u-lazy-load/u-lazy-load.vue"

	export default {
		components: {
			uLoading,
			uLazyLoad,
		},
		data() {
			return {
				loadingone: false,
				pageCurrent: 1, //分页
				pageSize: 6, //条数
				planArr: []
			}
		},
		onLoad() {
			this.getUserTaskByPage(this.pageCurrent, this.pageSize)
		},
		methods: {
			navurl(url) {
				uni.navigateTo({
					url: url
				})
			},
			myPlay(item, index, type) {
				console.log(item)
				uni.navigateTo({
					url: '/pages/subpackage/find/planDetails/planDetails?taskId=' + item.taskId
				})
			},
			getUserTaskByPage(pageCurrent, pageSize) {
				this.loadingone = true;
				let _this = this;
				this.$api.get(global.apiUrls.getUserTaskByPage + '?keyword=&pageCurrent=' + pageCurrent + '&pageSize=' +
						pageSize +
						'&userId=' + uni.getStorageSync(global.IS_DEV?'USER_DATA_BSY_T':'USER_DATA_BSY_Z').userId, {})
					.then(res => {
						if (res.data.code == 1000) {
							let records = res.data.result.records;
							_this.planArr = records;
						}
						_this.loadingone = false;
					}).catch(err => {
						_this.loadingone = false;
					})
			}
		}
	}
</script>

<style lang="scss">
	@import "../../find/basescss/basescss.scss";
</style>
